<template>
  <!-- 个人中心页 -->
	<view class="conter">
		<view class="hand">
	  <view class="portrait">
	</view>
	<view class="head_name">
	  <view class="head_name1">
	    {{userList.userName}}
	  </view>
    <view class="head_name2">
	    ID：{{userList.customerId}}
	  </view>
	</view>
   </view>
   <view class="middle">
   </view>
   <navigator class="list" url="/pages/message_center/message_center">
     <view class="list_img">
       <image src="../../static/my/zhmx.png" mode=""></image>
     </view> 
     <view class="list_word">
       消息中心
     </view>  
     <view class="list_left">
       <image src="../../static/my/xlxl.png" mode=""></image>
     </view>
   </navigator>
   <view class="middle">
   </view>
   <navigator class="list" url="/pages/Change_password/Change_password">
     <view class="list_img">
       <image src="../../static/my/lskc.png" mode=""></image>
     </view> 
     <view class="list_word">
       修改密码
     </view>  
     <view class="list_left">
       <image src="../../static/my/xlxl.png" mode=""></image>
     </view>
   </navigator>
   <view class="middle">
   </view>
   <navigator class="list" url="/pages/About_us/About_us">
     <view class="list_img">
       <image src="../../static/my/gywm.png" mode=""></image>
     </view> 
     <view class="list_word">
      关于我们
     </view>  
     <view class="list_left">
       <image src="../../static/my/xlxl.png" mode=""></image>
     </view>
   </navigator> 
  <!-- <navigator class="list" url="/pages/Feedback/Feedback">
     <view class="list_img">
       <image src="../../static/my/yjfk.png" mode=""></image>
     </view> 
     <view class="list_word">
      意见反馈
     </view>  
     <view class="list_left">
       <image src="../../static/my/xlxl.png" mode=""></image>
     </view>
   </navigator> -->
   <view class="b_btn">
     <button type="default" @click="goback">退出登录</button>
   </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
        userList:'',
				accessToken:'',
        refreshToken:''
			};
		},
    onLoad() {
      this.getUser()
      const token = uni.getStorageSync('token')
      const r_token = uni.getStorageSync('r_token')
      this.accessToken = token
      this.refreshToken = r_token
      // console.log(token)
      // console.log(r_token)
    },
    methods:{
      getUser(){
        this.$http.get('/upms/user',{}).then(res=>{
         if(res.code=='00000'){
           console.log('res',res)
           this.userList = res.data
         }
        })
      },
      goback(){
        this.$http.post('/auth/oauth/removeToken',{
          type:1,
        	accessToken:this.accessToken,
          refreshToken:this.refreshToken
        }).then(res=>{
        	console.log('退出',res)
        	if(res.code == '00000'){
            uni.showToast({
              title:'退出成功',
              duration:1500
            })
        		uni.removeStorageSync('token')
        		this.$base.reLaunch('/pages/login/login')
        	}
        })
      
      },
    }
	}
</script>

<style lang="scss">
  page{
     background: #FFF;
  }
.hand{
  width: 750rpx;
  height: 340rpx;
  background: url(../../static/my/bg3.png) no-repeat ;
  background-size: 100% 100%;
  overflow: hidden;
  
}
.portrait{
  width: 120rpx;
  height: 120rpx;
  background-color: yellowgreen;
  border-radius: 50%;
  margin: 167rpx 0 0 57rpx;
}
.head_name{
  position: absolute;
  left: 222rpx;
  top: 174rpx;
}
.head_name1{
  
  font-size: 40rpx;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #FFFFFF;
}
.head_name2{
  
  font-size: 24rpx;
  font-family: PingFang-SC-Medium, PingFang-SC;
  font-weight: 500;
  color: #FFFFFF;
}
.middle{
  width: 100%;
  height: 10rpx;
  background-color: #F8F9FA;
}
.list{
  position: relative;
  width: 100%;
  height: 120rpx;
  display: flex;
  align-items: center;
}
.list_img{
  margin-left: 41rpx;
  width: 52rpx;
  height: 52rpx;
  image{
    width: 100%;
    height: 100%;
  }
}
.list_word{
  font-size: 32rpx;
  font-family: PingFang-SC-Medium, PingFang-SC;
  font-weight: 500;
  color: #333333;
  margin-left: 29rpx;
}
.list_left{
  position: absolute;
  top: 45rpx;
  right: 38rpx;
  width: 13rpx;
  height: 22rpx;
  image{
    width: 100%;
    height: 100%;
  }
}
.b_btn{
  width: 702rpx;
  position: absolute;
  left: 24rpx;
  bottom: 100rpx;
}
</style>
